<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
</body>
<script>
    
    // Symbol的应用
    // 1. 可以将Symbol值作为对象的属性 => 表示独一无二的属性 
    // 2. 消除魔术字符串

    // 魔术字符串指的是，在代码之中多次出现、与代码形成强耦合的某一个具体的字符串或者数值。风格良好的代码，应该尽量消除魔术字符串，改由含义清晰的变量代替。


    // a ,b 参数计算的两个值
    // opt  运算符 "+" - * / %

    // 代码没有问题 => 但是换一种角度=> 传入的字符串(被opt接收)和参与比较的字符串并不是同一个字符串  
    // opt 接收的字符串 => 魔术字符串

    // function calc(a,opt,b){
    //     var result = null;
    //     switch(opt){
    //         case "+": result = a*1 + b*1; break;
    //         case "-": result = a - b; break;
    //         case "*": result = a * b; break;
    //         case "/": result = a / b; break;
    //         case "%": result = a % b; break;
    //     }
    //     return result;
    // }

    // var res = calc(10,"+",2);
    // console.log(res);


    // 怎么解决?
    // 将魔术字符串,改由含义清晰的变量代替 

    // 有多个,整和到一起
    var options = {
        // add:"+",
        // reduce:"-",
        // mul:"*",
        // div:"/",
        // mod:"%",

        // 反正都是自己和自己比全等  => 值是什么类型都无所谓
        // add:1,
        // reduce:2,
        // mul:3,
        // div:4,
        // mod:5,

        add:Symbol("+"),
        reduce:Symbol("-"),
        mul:Symbol("*"),
        div:Symbol("/"),
        mod:Symbol("%"),
    }


    function calc(a,opt,b){
        var result = null;
        switch(opt){
            case options.add: result = a*1 + b*1; break;
            case options.reduce: result = a - b; break;
            case options.mul: result = a * b; break;
            case options.div: result = a / b; break;
            case options.mod: result = a % b; break;
        }
        return result;
    }

    var res = calc(10,options.add,2);
    console.log(res);
   




</script>
</html>